<template>
 <div>  
  <div>
   <input class="item" v-model="inputValue"/>
   <button @click="handleSubmit">提交</button>
  </div>
  <ul>
  	<!--:key="index"-->
      <todo-item v-for="(item,index) of list"  :key="index" :content="item" :index="index" @delete="handleDelete"></todo-item>
  </ul>
  <h1 class="item">asdasdad</h1>
</div>
</template>

<script>

import TodoItem  from './components/TodoItem'

export default {
   components:{
   	'todo-item': TodoItem
   },
   data:function(){
   	 return {
   	 	   inputValue:'',
   	 	   list:[]
   	 }
   },
   methods:{
   	 handleSubmit:function(){
   	 	 this.list.push(this.inputValue);
   	 	 this.inputValue='';
   	 },
   	 handleDelete:function(index){
   	 	 this.list.splice(index,1);
   	 }
   }
}
</script>

<style>

</style>
